/*
 * @Description: 我的已办任务
 * @Author: DHL
 * @Date: 2023-05-26 11:31:12
 * @LastEditors: DHL
 * @LastEditTime: 2023-07-28 10:15:51
 */

import { defineComponent, reactive, ref, onMounted, markRaw } from 'vue'
import { assign, cloneDeep } from 'lodash-es'
import { TwTableOptions } from '@/types/table.d'
import usePermission from '@/hooks/web/permission'
import { FlowTaskModel, FlowTaskPageParams } from '@/api/flow/model/flowTask'
import { apiFlowTaskDone } from '@/api/flow/flowTask'
import { dynamicComponentImport } from '@/utils/dynamicComponentUtils'
import twFlowchartPopup from '@/pages/flow/twFlow/twFlowchart/twFlowchartPopup.vue'

export default defineComponent({
  name: 'MyTaskDone',
  components: { twFlowchartPopup },
  setup(props) {
    //////////////////////////////////////////////////
    // 属性
    //////////////////////////////////////////////////

    const loading = ref(false)
    const loadingByDel = ref(false)

    // 权限控制
    const { hasPermission } = usePermission()

    /**
     * 表格数据
     */
    const tableData = ref()

    /**
     * 查询表单
     */
    const searchFormRef = ref()

    /**
     * 数据列表
     */
    const tableRef = ref()

    /**
     * 公共
     */
    const state = reactive({})

    //////////////////////////////////////////////////
    // 查询表单
    //////////////////////////////////////////////////

    const defaultSearchForm = {
      queryLikeStr: '', // 模糊查询关键字
      id: null, // 主键
      rev: null, // 版本号
      executionId: null, // 执行实例ID
      procInstId: null, // 流程实例ID
      procDefId: null, // 流程定义ID
      taskDefId: null, //
      scopeId: null, //
      subScopeId: null, //
      scopeType: null, //
      scopeDefinitionId: null, //
      propagatedStageInstId: null, //
      name: null, // 名称
      parentTaskId: null, // 父任务ID
      description: null, // 描述
      taskDefKey: null, // 人物定义标识
      owner: null, // 被代理人
      assignee: null, // 经办人
      delegation: null, // 委托状态
      priority: null, // 优先级
      createTime: null, // 创建时间
      dueDate: null, // 截止时间
      category: null, // 分类
      suspensionState: null, // 挂起状态(1代表激活 2代表挂起)
      tenantId: null, // 租户ID
      formKey: null, // 表单标识
      claimTime: null, //
      isCountEnabled: null, //
      varCount: null, //
      idLinkCount: null, //
      subTaskCount: null, //
      procInstName: null, // 流程实例名称
      procDefName: null, // 流程定义名称
      ownerName: null, // 被代理人
      assigneeName: null // 经办人
    }

    /**
     * 查询表单
     */
    const searchForm = reactive(cloneDeep(defaultSearchForm))

    //////////////////////////////////////////////////
    // 表格
    //////////////////////////////////////////////////

    /**
     * 表格合计数据
     */
    const footerData = ref([] as string[][])

    /**
     * 表格配置
     */
    const tableOptions = reactive<TwTableOptions>({
      id: 'actRuTaskTable',
      sortConfig: {
        defaultSort: [{ field: 't.start_time_', order: 'desc' }]
      },
      columns: [
        { type: 'checkbox', fixed: 'left', title: '', align: 'center', width: 40 },
        { type: 'seq', fixed: 'left', title: '序号', width: 50 },
        { field: 'procInstName', title: '名称', sortable: true },
        { field: 'procDefName', title: '分类', sortable: true },
        { field: 'name', title: '任务名称', sortable: true },
        { field: 'assigneeName', title: '经办人', sortable: true },
        { field: 'ownerName', title: '委托人', sortable: true },
        { field: 'delegation', title: '委托状态', sortable: true },
        { field: 'priority', title: '优先级', sortable: true },
        { field: 'startTime', title: '开始时间', sortable: true },
        { field: 'endTime', title: '结束时间', sortable: true },
        { field: 'durationStr', title: '耗时', sortable: false },

        { title: '操作', fixed: 'right', width: 110, slots: { default: 'action' } }
      ]
    })

    /**
     * 绑定事件
     */
    const tableEvents = reactive({})

    //////////////////////////////////////////////////
    // 函数
    //////////////////////////////////////////////////

    /**
     * 查询表格数据函数
     * @param queryParams
     */
    function searchList(queryParams: FlowTaskPageParams) {
      loading.value = true
      const searchParams = assign(queryParams, searchForm)
      apiFlowTaskDone(searchParams)
        .then((result) => {
          tableData.value = result
        })
        .catch(() => {})
        .finally(() => {
          loading.value = false
        })
    }

    /**
     * 查询表格数据
     */
    function handleSearch() {
      tableRef.value.handleQuery()
    }

    /**
     * 刷新
     */
    function handleRefresh() {
      tableRef.value.handleReload()
    }

    /**
     * 重置
     */
    function handleReset() {
      assign(searchForm, cloneDeep(defaultSearchForm))
      tableRef.value.handleQuery()
    }

    //////////////////////////////////////////////////
    // 流程图
    //////////////////////////////////////////////////
    const twFlowchartPopupRef = ref()

    /**
     * 预览流程图
     */
    function handleOpenFlowChart(row: FlowTaskModel) {
      twFlowchartPopupRef.value.handleOpen({
        procInstId: row.procInstId
      })
    }

    //////////////////////////////////////////////////
    // 办理
    //////////////////////////////////////////////////
    /**
     * 表单
     */
    const myComponentRef = ref()

    /**
     * 组件
     */
    const myComponent = shallowRef()

    /**
     * 办理任务
     */
    function handleApprove(row: FlowTaskModel) {
      const component = '/oa/leave/form'
      dynamicComponentImport(component).then((result: any) => {
        if (result) {
          myComponent.value = result?.default

          nextTick(() => {
            myComponentRef.value.handleOpen('approval', { id: row.businessKey })
          })
        }
      })
    }

    //////////////////////////////////////////////////
    // 生命周期
    //////////////////////////////////////////////////
    onMounted(() => {})

    return {
      loading,
      tableData,
      searchFormRef,
      tableRef,
      state,
      searchForm,
      tableOptions,
      tableEvents,
      searchList,
      handleSearch,
      handleRefresh,
      handleReset,
      twFlowchartPopupRef,
      handleOpenFlowChart,
      handleApprove,
      myComponentRef,
      myComponent
    }
  }
})
